<template>
  <div class="child_content">
    这里是子组件，父组件传过来的name:{{name}}
    <div>
      <el-button
        style="width: 150px;margin-top: 20px"
        type="primary" @click="useParentMethod">
        调用父组件方法
      </el-button>
    </div>
    <div>
      <el-button
        style="width: 150px;margin-top: 20px"
        type="primary" @click="changeParentName">
        修改父组件属性
      </el-button>
    </div>


  </div>

</template>

<script>
  export default {
    name: "ComponetsTest",
    props: {
      name: {
        type: String,
        default: ""
      }
    },
    methods: {
      changeParentName() {
        this.$parent.parentName = "修改了";
      },
      childMethod() {
        this.$alert("调用了子组件方法", "提示", {
          confirmButtonText: "确定"
        });
      },
      useParentMethod() {
        this.$emit("useParentMethod");
      }


    }
  };
</script>

<style scoped>
  .child_content {
    width: 500px;
    display: flex;
    flex-direction: column
  }

</style>
